<!--  -->
<template>
  <div class="five">
    <div class="wrapper">
      <div class="content">
        <el-carousel :interval="3000" type="card" height="250px">
          <el-carousel-item>
            <div @click="click1">
              <img src="~assets/img/show/15.jpg" alt="" />
            </div>
          </el-carousel-item>
          <el-carousel-item>
            <div @click="click2">
              <img src="~assets/img/show/16.jpg" alt="" />
            </div>
          </el-carousel-item>
          <el-carousel-item>
            <div @click="click3">
              <img src="~assets/img/show/17.jpg" alt="" />
            </div>
          </el-carousel-item>
          <el-carousel-item>
            <div @click="click4">
              <img src="~assets/img/show/18.jpg" alt="" />
            </div>
          </el-carousel-item>
          <el-carousel-item>
            <div @click="click5">
              <img src="~assets/img/show/19.jpg" alt="" />
            </div>
          </el-carousel-item>
        </el-carousel>
        <div class="totitle">中国共产党历史上发生的重大事件</div>
        <div class="container">
          <div class="item">
            <div class="title">
              <h3>一、中国共产党成立</h3>
            </div>
            <div class="info">
              1921年7月23日，中国共产党第一次全国代表大会在上海法租界望志路106号召开。派出13名代表，大会确定党的名称为“中国共产党”，党纲是“以无产阶级革命军队推翻资产阶级”，选举陈独秀为中央局书记。一大宣告中国共产党正式成立，这是中国历史上开天辟地的大事。
            </div>
            <div class="img">
              <img src="~assets/img/five/01.jpg" alt="" />
            </div>
          </div>
          <el-divider><i class="el-icon-loading"></i></el-divider>
          <div class="item">
            <div class="title"><h3>二、二大制定党的最低纲领和最高纲领</h3></div>
            <div class="info">
              1922年7月，二大在上海举行。最低纲领为：清除内乱，打倒军阀，建设国内和平;推翻国际帝国主义的压迫，达到中华民族完全独立;统一中国为真正的民主共和国。最高纲领为：组织无产阶级，用阶级斗争的手段，建立劳农专政的政治，铲除私有财产制度，渐次达到一个共产主义社会。
            </div>
            <div class="img">
              <img src="~assets/img/five/02.jpg" alt="" />
            </div>
          </div>
          <el-divider><i class="el-icon-loading"></i></el-divider>
          <div class="item">
            <div class="title"><h3>三、党的三大</h3></div>
            <div class="info">
              1923年6月12～20日，在广州召开三大，确定的建立国共合作革命统一战线的策略，促进了第一次国共合作的实现，使共产党活动的政治舞台迅速扩大，加速了中国革命的步伐，为波澜壮阔的第一次大革命做了准备。￼
            </div>
            <div class="img">
              <img src="~assets/img/five/03.jpg" alt="" />
            </div>
          </div>
          <el-divider><i class="el-icon-loading"></i></el-divider>
          <div class="item">
            <div class="title"><h3>四、北伐战争</h3></div>
            <div class="info">
              1926年7月9日，国民革命军在广州北伐，直接目标是受帝国主义支持的北洋军阀。1928年12月，张学良东北易帜，中国实现了形式上的统一。
            </div>
            <div class="img">
              <img src="~assets/img/five/04.jpg" alt="" />
            </div>
          </div>
          <el-divider><i class="el-icon-loading"></i></el-divider>
          <div class="item">
            <div class="title"><h3>五、南昌起义</h3></div>
            <div class="info">
              1927年8月1日，在以周恩来为书记的领导下，在南昌打响武装反抗国民党反动派的第一枪。标志着中国共产党独立领导革命战争、创建人民军队和武装夺取政权的开始。
            </div>
            <div class="img">
              <img src="~assets/img/five/05.jpg" alt="" />
            </div>
          </div>
          <el-divider><i class="el-icon-loading"></i></el-divider>
          <div class="item">
            <div class="title"><h3>六、“八七”会议</h3></div>
            <div class="info">
              1927年8月7日，中共中央在汉口召开紧急会议，会议着重批判了以陈独秀为首的右倾机会主义错误，确定了土地革命和武装起义的方针，选出瞿秋白为首的新的中共中央临时政治局。中国革命开始由大革命失败到土地革命兴起的历史性转变。
            </div>
            <div class="img">
              <img src="~assets/img/five/06.jpg" alt="" />
            </div>
          </div>
          <el-divider><i class="el-icon-loading"></i></el-divider>
          <div class="item">
            <div class="title"><h3>七、秋收起义</h3></div>
            <div class="info">
              1927年9月9日，湘鄂边界秋收起义爆发。10月上旬，毛泽东率领起义军到达井冈山地区，开始了创建井冈山革命根据地的斗争。三湾改编从组织上确立了党对军队的领导，这是建设无产阶级领导的新型人民军队的重要开端。
            </div>
            <div class="img">
              <img src="~assets/img/five/07.jpg" alt="" />
            </div>
          </div>
          <el-divider><i class="el-icon-loading"></i></el-divider>
          <div class="item">
            <div class="title"><h3>八、创建井冈山革命根据地</h3></div>
            <div class="info">
              1927年10月，毛泽东率领秋收起义部队上湘赣两省交界的井冈山。1928年2月，井冈山革命根据地初步形成。农村包围城市、武装夺取政权思想的提出，标志着中国化的马克思主义即毛泽东思想的初步形成。这是马克思主义在中国的创造性地运用和发展，毛泽东是马克思主义中国化的伟大开拓者。
            </div>
            <div class="img">
              <img src="~assets/img/five/08.jpg" alt="" />
            </div>
          </div>
          <el-divider><i class="el-icon-loading"></i></el-divider>
          <div class="item">
            <div class="title"><h3>九、古田会议</h3></div>
            <div class="info">
              1929年12月28～29日，在福建省上杭县古田召开，即古田会议。毛泽东当选为书记。古田会议决议案的中心思想是用无产阶级思想进行军队和党的建设。在军队建设方面，党指挥枪而不是枪指挥党等;在党的建设方面，决议强调了加强党的思想建设的重要性等。古田会议决议是中国共产党和红军建设的纲领性文献，是党和人民军队建设史上的里程碑，具有十分重要的意义。
            </div>
            <div class="img">
              <img src="~assets/img/five/09.jpg" alt="" />
            </div>
          </div>
          <el-divider><i class="el-icon-loading"></i></el-divider>
          <div class="item">
            <div class="title"><h3>十、红军长征</h3></div>
            <div class="info">
              由于“左”倾教条主义错误，中央苏区第五次反“围剿”失败。1934年10月至1936年10月，红军第一、第二、第四方面军和第二十五军，在党的领导下，完成二万五千里长征。
            </div>
            <div class="img">
              <img src="~assets/img/five/10.jpg" alt="" />
            </div>
          </div>
          <el-divider><i class="el-icon-loading"></i></el-divider>
          <div class="item">
            <div class="title"><h3>十一、遵义会议</h3></div>
            <div class="info">
              1922年7月，二大在上海举行。最低纲领为：清除内乱，打倒军阀，建设国内和平;推翻国际帝国主义的压迫，达到中华民族完全独立;统一中国为真正的民主共和国。最高纲领为：组织无产阶级，用阶级斗争的手段，建立劳农专政的政治，铲除私有财产制度，渐次达到一个共产主义社会。
            </div>
            <div class="img">
              <img src="~assets/img/five/11.jpg" alt="" />
            </div>
          </div>
          <el-divider><i class="el-icon-loading"></i></el-divider>
          <div class="item">
            <div class="title"><h3>十二、“一二•九”运动</h3></div>
            <div class="info">
              1935年12月9日，在中共北平临时工作委员会领导下，北平学生高喊
              “反对日本帝国主义”
              “停止内战，一致对外”等口号，举行抗日救国示威游行。之后，
              抗日救亡斗争发展成为全国规模的群众运动。一二•九运动揭露了日本吞并华北进而独占中国的阴谋，打击了国民党的妥协投降政策，极大地促进了中华民族的觉醒，标志着中国人民抗日救亡民主运动新高潮的到来。
            </div>
            <div class="img">
              <img src="~assets/img/five/12.jpg" alt="" />
            </div>
          </div>
          <el-divider><i class="el-icon-loading"></i></el-divider>
          <div class="item">
            <div class="title"><h3>十三、瓦窑堡会议</h3></div>
            <div class="info">
              1935年12月17～25日，中共中央在陕北子长县瓦窑堡召开政治局扩大会议，即瓦窑堡会议。会议通过了《中央关于目前政治形势与党的任务决议》，明确提出了党的基本策略任务是建立广泛的抗日民族统一战线。瓦窑堡会议是从第五次反“围剿”失败到全民族抗战兴起过程中召开的一次重要会议。表明党在总结经验教训的基础上，正在从中国的实际情况出发，创造性地进行工作。
            </div>
            <div class="img">
              <img src="~assets/img/five/13.jpg" alt="" />
            </div>
          </div>
          <el-divider><i class="el-icon-loading"></i></el-divider>
          <div class="item">
            <div class="title"><h3>十四、卢沟桥事变--全民族抗战爆发</h3></div>
            <div class="info">
              1937年7月7日夜，日本侵略军借口炮轰宛平城，攻击卢沟桥。当地中国驻军二十九路军奋起抵抗，卢沟桥事变爆发。日本开始了全面侵华战争，中国则开展了全国性抗战。
            </div>
            <div class="img">
              <img src="~assets/img/five/14.jpg" alt="" />
            </div>
          </div>
          <el-divider><i class="el-icon-loading"></i></el-divider>
          <div class="item">
            <div class="title"><h3>十五、百团大战</h3></div>
            <div class="info">
              1940年8月20日～1941年1月24日，八路军总部在华北发动了一次大规模对日军的进攻，达到105个团、20万余人，史称“百团大战”。百团大战是全国抗战以来八路军在华北发动的规模最大、持续时间最长的一次带战略性进攻的战役，振奋了全国民心。
            </div>
            <div class="img">
              <img src="~assets/img/five/15.jpg" alt="" />
            </div>
          </div>
          <el-divider><i class="el-icon-loading"></i></el-divider>
          <div class="item">
            <div class="title"><h3>十六、党的七大</h3></div>
            <div class="info">
              1945年4月23日～6月11日，七大在延安举行。确定“以马克思列宁主义的理论与中国革命的实践之统一的思想--毛泽东思想，作为自己一切工作的指针”。七大以“团结的大会、胜利的大会”载入史册。
            </div>
            <div class="img">
              <img src="~assets/img/five/16.jpg" alt="" />
            </div>
          </div>
          <el-divider><i class="el-icon-loading"></i></el-divider>
          <div class="item">
            <div class="title"><h3>十七、三大战役</h3></div>
            <div class="info">
              三大战役指辽沈战役、淮海战役、平津战役。三大战役的胜利，为中国革命在全国的胜利奠定了基础。
            </div>
            <div class="img">
              <img src="~assets/img/five/17.jpg" alt="" />
            </div>
          </div>
          <el-divider><i class="el-icon-loading"></i></el-divider>
          <div class="item">
            <div class="title"><h3>十八、中华人民共和国成立</h3></div>
            <div class="info">
              1949年9月21日至30日，中国人民政治协商会议第一届全体会议在北平举行，大会通过起临时宪法作用的《中国人民政治协商会议共同纲领》，选举毛泽东为中央人民政府主席。会议通过北平为中华人民共和国首都，改名为北京;决定采用公元纪年;以《义勇军进行曲》为代国歌;国旗为五星红旗。10月1日，首都北京举行开国大典
            </div>
            <div class="img">
              <img src="~assets/img/five/18.jpg" alt="" />
            </div>
          </div>
          <el-divider><i class="el-icon-loading"></i></el-divider>
          <div class="item">
            <div class="title"><h3>十九、社会主义制度的确立</h3></div>
            <div class="info">
              1956年年底，我国基本完成了对生产资料私有制的社会主义改造，初步建立起公有制占绝对优势的社会主义经济制度。社会主义政治制度、经济制度的确立，为当代中国的一切发展和进度奠定了制度基础，这是历史上的一个里程碑。
            </div>
            <div class="img">
              <img src="~assets/img/five/19.jpg" alt="" />
            </div>
          </div>
          <el-divider><i class="el-icon-loading"></i></el-divider>
          <div class="item">
            <div class="title">
              <h3>二十、习近平新时代中国特色社会主义思想</h3>
            </div>
            <div class="info">
              党的十八大以来，以习近平同志为主要代表的中国共产党人，顺应时代发展，从理论和实践结合上系统回答了新时代坚持和发展什么样的中国特色
              社会主义、怎样坚持和发展中国特色社会主义这个重大时代课题，创立了习近平新时代中国特色社会主义思想。
            </div>
            <div class="img">
              <img src="~assets/img/five/20.jpg" alt="" />
            </div>
          </div>
          <el-divider><i class="el-icon-loading"></i></el-divider>
        </div>
        <div class="back-top" @click="backTop">
          <img src="~assets/img/backtop/top.png" alt="" />
        </div>
                <div class="back-home" @click="backHome">
          <img src="~assets/img/backtop/backhome1.png" alt="" />
        </div>
      </div>
    </div>
  </div>
</template>

<script>
export default {
  name: "One",
  components: {},
  data() {
    return {};
  },

  methods: {
    backTop() {
      this.$router.go(0);
    },

    click1() {
      this.$router.push("/one").catch((err) => {
        err;
      });
    },
    click2() {
      this.$router.push("/two");
    },
    click3() {
      this.$router.push("/three");
    },
    click4() {
      this.$router.push("/four");
    },
    click5() {
      this.$router.push("/five");
    },
        backHome() {
      this.$router.push("/home");
    },
  },
};
</script>

<style scoped>
.five {
  width: 100vw;
  height: 100vh;
  background: pink;
  overflow: hidden;
  background: url("~assets/img/show/18.jpg");
  /* background: url("~assets/img/one/04.jpg"); */
  background-size: cover;
}
.back-home{
  width: 60px;
  height: 60px;
  position: fixed;
  top: 40px;
  left: 160px;
  /* background:#AE454A ; */
  background: #fff;
  border-radius: 50%;
  opacity: .8;
  box-shadow: 0 10px 10px rgba(0, 0, 0, .3);
  overflow: hidden;
}
.back-home img{
  margin-top: 7px;
width: 90%;
transition: .5s;
}
.back-home:hover img{
  transform: scale(1.2);
}
.el-carousel__item img {
  width: 100%;
}
.back-top {
  /* width: 50px;
  height: 50px; */
  /* background: pink; */
  position: fixed;
  bottom: 40px;
  right: 320px;
  border-radius: 50%;
}
.back-top img {
  width: 70%;
  transition: 0.4s;
  border-radius: 50%;
}
.back-top img:hover {
  transform: translateY(-8px);
  /* box-shadow: 0 10px 10px rgba(0, 0, 0, .2); */
}
.wrapper {
  width: 1000px;
  margin: 0 auto;
  background: #fff;
  height: 100%;
  overflow-y: scroll;
  /* opacity: 0.9; */
}
.wrapper::-webkit-scrollbar {
  display: none;
}
.totitle {
  margin-top: 20px;
  margin-bottom: 20px;
  text-align: center;
  font-size: 22px;
  font-weight: 600;
  /* text-indent: 2em; */
  color: #333;
}
.content {
  overflow: hidden;
  width: 100%;
  position: relative;
}
.container {
  width: 60%;
  margin: 0 auto;
  background: #fff;
  border-left: #e04042 solid 1px;
  border-right: #e04042 solid 1px;
}
.container .item {
  padding: 20px;
}
.container .item .title {
  margin: 0 auto;
  /* height: 30px; */
  line-height: 30px;
  text-align: center;
  color: #e04042;
  font-weight: 600;
  margin-bottom: 20px;
  display: flex;
  justify-content: center;
}
.container .item .title h3 {
  font-size: 15px;
  padding: 20px 20px;
  border: solid 1px #e04042;
  line-height: 2px;
}
.container .item .info {
  background: #fdf6f0;
  padding: 20px;
  border-radius: 20px;
  line-height: 2em;
  font-size: 13px;
  text-indent: 2em;
  text-align: justify;
}
.container .item .img {
  border: #e04042 3px solid;
  text-align: center;
  margin-top: 30px;
  border-radius: 10px;
}
.container .item .img img {
  width: 70%;
  padding: 10px;
  border-radius: 20px;
  transition: 0.4s;
}
.container .item .img img:hover {
  transform: scale(1.3);
}
</style>